﻿define([
"dojo/_base/declare", "dijit/form/Textarea", "dojo/on", "dojo/_base/lang", "dojo/fx", "dojo/_base/fx", "dojo/dom-construct", "dojo/dom-style", "dojo"
],
function (declare, Textarea, on, lang, coreFx, baseFx, domConstruct, domStyle, dojo) {
    var overflow = 0;

    function isNonprintableKey(keycode) {
        if ((keycode < 48 && keycode != 32) || (keycode >= 91 && keycode <= 93) || (keycode >= 106 && keycode <= 123) || keycode == 144 || keycode == 145)
            return true;
        return false;
    }

    function blinkBackground(nodeId, blinks) {
        var red = baseFx.animateProperty({
            node: nodeId,
            properties: {
                backgroundColor: "#FF7373"
            },
            duration: 100,
            delay: 50
        });

        var white = baseFx.animateProperty({
            node: nodeId,
            properties: {
                backgroundColor: "#fff"
            },
            duration: 100,
            delay: 50
        });

        var effects = new Array();
        for (var i = 0; i < blinks; i++) {
            effects.push(red);
            effects.push(white);
        }

        coreFx.chain(effects).play();
    }

    return declare("ow.epi.longStringProperty.widgets.LongStringLimited", [Textarea], {
        intermediateChanges: true,

        postCreate: function () {

            this.inherited(arguments);
            domStyle.set(this.textbox, "width", "582px");
            this.textbox.value = this.currentContent;
            on(this.textbox, "keydown", this._onTextBoxKeyDown);
            on(this.textbox, "keyup", lang.hitch(this, this._onTextBoxKeyUp));
        },

        onFocus: function () {
            var counterNode = this.getCounterNode();
            var charactersLeft = this.maxLength - this.textbox.value.length;
            counterNode.textContent = this.maxContentLengthCounterText + " " + charactersLeft;
            domStyle.set(counterNode, "display", "block");
        },

        onBlur: function () {
            var counterNode = this.getCounterNode();
            domStyle.set(counterNode, "display", "none");
        },

        onChange: function () {
            var counterNode = this.getCounterNode();
            var charactersLeft = this.maxLength - this.textbox.value.length;
            counterNode.textContent = this.maxContentLengthCounterText + " " + charactersLeft;
        },

        _onTextBoxKeyDown: function (e) {
            if (e.keyCode == dojo.keys.ENTER)
                dojo.stopEvent(e);
        },

        _onTextBoxKeyUp: function (e) {
            if (isNonprintableKey(e.keyCode))
                return;

            var charsLeft = this.maxLength - this.textbox.value.length;

            if (charsLeft > 0)
                overflow = 0;

            if (charsLeft <= 0)
                overflow++;

            if (overflow > 1)
                blinkBackground(this.textbox, 3);
        },

        getCounterNode: function () {
            var node = dojo.byId(this.textbox.id + "counter");

            if (node == null) {
                node = domConstruct.create("div", null, this.textbox, "after");
                node.id = this.textbox.id + "counter";
            }

            return node;
        }
    });
});